interface Listener {
  // your code
  (...args: any[]): void
}

interface Events {
  // your code
  [propName: string]: Array<Listener>
  // click?: Array<Listener>
}

class EventEmitter {
  // your code 定义私有属性 events
  private events: Events = {}

  on(eventName: string, listener: Listener) {
    // your code
    // 检查事件是否存储
    if (typeof this.events[eventName] === 'undefined') {
      // 创建事件名称
      this.events[eventName] = []
    }
    // 推入新的事件处理函数
    this.events[eventName].push(listener)
  }

  emit(eventName: string, ...args: any[]) {
    // your code
    // 检查是否存在
    if (typeof this.events[eventName] !== 'undefined') {
      this.events[eventName].forEach(handleFn => {
        handleFn(...args)
      })
    }
  }

  off(eventName: string, listener?: Listener) {
    // your code
    if(typeof listener === "undefined") {
      // 清空事件
      delete this.events[eventName]
    } else {
      // 清空某一个事情处理函数
      this.events[eventName] = this.events[eventName].filter(v => v !== listener)
    }

  }

  once(eventName: string, listener: Listener) {
    // your code
  }

}

// 调用示例
const req = new EventEmitter()

const handler = () => {
  console.log('hello world')
}

const handleClick = () => {
  console.log(11111111111111);
}
// 发布
req.on('click', handler)
req.on('click', handleClick)

// 订阅
req.emit('click')

req.off('click', handler)

req.emit('click')

// this.$on('handleClick', (id) => {})

// this.$emit('handleClick', 1111)

// console.log(req);






// 类  
// 对象
// {
//   'click': [handle2, handle3]
// }
// mitt.on('data', handle1)
// mitt.on('click', handle2)
// mitt.on('click', handle3)

// mitt.emit('data')
// mitt.emit('click')
// mitt.emit('click')


// mitt.off('data')




document.body.innerHTML = '<button>点我</button>'

document.body.addEventListener('click', handler)

document.body.addEventListener('click', handleClick)

document.body.removeEventListener('click', handler)
